<script>
const vue_main = VueInit(window.config);
window.vue_main = vue_main;
vue_main.el = '#vue_main';
vue_main.created = function () {
    // alert('vue_main.created');
    this.loadmenu();
    jQuery('.sidebar-menu').show();
    if (vue_main.data.config.pagemode === 'iframe') {
        if (!!window.ActiveXObject || 'ActiveXObject' in window) {
            window.addEventListener('hashchange', function () {
                let currentPath = window.location.hash.slice(1);
                if (window.vue_main_new.$route.path !== currentPath) {
                    window.vue_main_new.$router.push(currentPath);
                }
            }, false);
        }
        iframe_content.location.href = this.$route.path;
        vue_main.data.pathparts = getPathparts(this.$route.path);
        vue_content_header.data.pathparts = vue_main.data.pathparts;
    }
};
vue_main.data.pathparts = window.parseURL().pathparts;
// console.log(vue_main.data.pathparts)
function load_menu (menu) {
    // 把从数据库里读取到的二维表转换成树形结构
    const out = {};
    for (var i in menu) {
        const row = menu[i];
        if (!out.hasOwnProperty(row['parent_id'])) {
            out[row['parent_id']] = {};
        }
        const r = {};
        r.name = row['name'];
        r.title = row['title'];
        r.fa = row['fa'];
        r.child = (function(){
            if (!out.hasOwnProperty(row['id'])) {
                out[row['id']] = {};
            }
            return out[row['id']];
        })();
        out[row['parent_id']][row['name']] = r;
        // alert(row['name']);
    }
    // alert(JSON.stringify(out['0']));
    return out['0'];
}
vue_main.data.menu = [];
vue_main.watch = {};
vue_main.watch.menu = function () {
    this.$nextTick(function(){
        console.log('watch.menu>$nextTick');
        jQuery(window).trigger('load');
    })
};
vue_main.methods.loadmenu = function () {
    const that = this;
    this.ApiPost('/panel/menu', {}).then(function (res) {
        that.menu = load_menu(res.data.menu);
        vue_content_header.data.menu = that.menu;
        //console.log(that.menu)
    }, function (res) {
        location.href = '/public/login.html'
    }).catch(function (reason) {
        console.log('catch11:', reason);
    })
};
vue_main.methods.logout = function () {
    const that = this;
    this.ApiPost('/panel/logout', {}).then(function (res) {
        location.href = '/public/login.html'
    }, function (res) {
    }).catch(function (reason) {
        console.log('catch11:', reason);
    })
};
vue_main.methods.objCount = window.objCount;
</script>


<div id="vue_main">
  <header class="main-header">

    <!-- Logo -->
    <a href="javascript:void(0)" class="logo">
      <!-- mini logo for sidebar mini 50x50 pixels -->
      <span class="logo-mini"><b><?=$GLOBALS['config']['title_abbr']?></b></span>
      <!-- logo for regular state and mobile devices -->
      <span class="logo-lg"><?=$GLOBALS['config']['title_full']?></span>
    </a>

    <!-- Header Navbar: style can be found in header.less -->
    <nav class="navbar navbar-static-top">
      <!-- Sidebar toggle button-->
      <a href="index.htm" class="sidebar-toggle" data-toggle="push-menu" role="button">
        <span class="sr-only">Toggle navigation</span>
      </a>
      <!-- Navbar Right Menu -->
<?php include (__DIR__) . '/navbar.php';?>

    </nav>
  </header>
  <!-- Left side column. contains the logo and sidebar -->
  <aside class="main-sidebar">
    <!-- sidebar: style can be found in sidebar.less -->
    <section class="sidebar">
      <!-- Sidebar user panel -->
      <div class="user-panel" v-if="0">
        <div class="pull-left image">
          <img src="./images/user.png" class="img-circle" alt="User Image">
        </div>
        <div class="pull-left info">
          <p><?=$GLOBALS['config']['title_abbr']?>用户</p>
          <a href="#"><i class="fa fa-circle text-success"></i> Online</a>
        </div>
      </div>
      <!-- search form -->
      <form action="#" method="get" class="sidebar-form" style="display: none;">
        <div class="input-group">
          <input type="text" name="q" class="form-control" placeholder="Search...">
          <span class="input-group-btn">
                <button type="submit" name="search" id="search-btn" class="btn btn-flat">
                  <i class="fa fa-search"></i>
                </button>
              </span>
        </div>
      </form>
      <!-- /.search form -->
      <!-- sidebar menu: : style can be found in sidebar.less -->
<?php

include (__DIR__) . '/admin/sidebar-menu.php';
?>
    </section>
    <!-- /.sidebar -->
  </aside>
</div>

<script>
if (vue_main.data.config.pagemode === 'iframe') {
    vue_main.watch['$route'] = function (to, from) {
        console.log(to, from);
        iframe_content.location.href = to.path;
        vue_main.data.pathparts = getPathparts(to.path);
        vue_content_header.data.pathparts = vue_main.data.pathparts;
    };
    const routes = [];
    //routes.push({path:'/1',component:{template:'<a href="aaa">xxxx</a>'}});
    vue_main.router = new VueRouter({'routes': routes});
}
jQuery(function() {
    window.vue_main_new = new Vue(vue_main);
});
</script>
